<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns="http://www.w3.org/1999/html">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>button</title>
        <link type="text/css" rel="stylesheet" href="../../dist/cute.css"/>
        <style type="text/css">
            .m8 {
                margin: 8px;
            }
        </style>
    </head>
    <body class="m8">
        <div class="page-header">Style</div>
        default[minor]
        <div class="m8">
            <button class="btn" type="button"><i class="icon icon-cart"></i>&nbsp;Default</button>
            <input class="btn" type="submit" value="Submit Button" />
            <a class="btn" href="javascript:;" />Link Button</a>
            <button class="btn btn-disabled" type="button">Disabled Button</button>
            <input class="btn btn-selected" type="submit" value="selected Button" />
            <a class="btn btn-disabled" href="javascript:;" />Disabled Link Button</a>
        </div>
        primary
        <div class="m8">
            <button class="btn btn-primary" type="button">默认</button>
            <input class="btn btn-primary" type="submit" value="按钮" />
            <a class="btn btn-primary" href="javascript:;" />链接按钮</a>
            <button class="btn btn-primary btn-disabled btn-primary-disabled" type="button">禁用的按钮</button>
            <input class="btn btn-primary btn-selected btn-primary-selected" type="submit" value="选中的按钮" />
            <a class="btn btn-primary btn-disabled btn-primary-disabled" href="javascript:;" />禁用的链接按钮</a>
        </div>
        inverse
        <div class="m8">
            <button class="btn btn-inverse" type="button">Default</button>
            <input class="btn btn-inverse" type="submit" value="Submit Button" />
            <a class="btn btn-inverse" href="javascript:;" />Link Button</a>
            <button class="btn btn-inverse btn-disabled btn-inverse-disabled" type="button">Disabled Button</button>
            <input class="btn btn-inverse btn-selected btn-inverse-selected" type="submit" value="selected Button" />
            <a class="btn btn-inverse btn-disabled btn-inverse-disabled" href="javascript:;" />Disabled Link Button</a>
        </div>
        success
        <div class="m8">
            <button class="btn btn-success" type="button">Default</button>
            <input class="btn btn-success" type="submit" value="Submit Button" />
            <a class="btn btn-success" href="javascript:;" />Link Button</a>
            <button class="btn btn-success btn-disabled btn-success-disabled" type="button">Disabled Button</button>
            <input class="btn btn-success btn-selected btn-success-selected" type="submit" value="selected Button" />
            <a class="btn btn-success btn-disabled btn-success-disabled" href="javascript:;" />Disabled Link Button</a>
        </div>
        info
        <div class="m8">
            <button class="btn btn-info" type="button">Default</button>
            <input class="btn btn-info" type="submit" value="Submit Button" />
            <a class="btn btn-info" href="javascript:;" />Link Button</a>
            <button class="btn btn-info btn-disabled btn-info-disabled" type="button">Disabled Button</button>
            <input class="btn btn-info btn-selected btn-info-selected" type="submit" value="selected Button" />
            <a class="btn btn-info btn-disabled btn-info-disabled" href="javascript:;" />Disabled Link Button</a>
        </div>
        warn
        <div class="m8">
            <button class="btn btn-warn" type="button">Default</button>
            <input class="btn btn-warn" type="submit" value="Submit Button" />
            <a class="btn btn-warn" href="javascript:;" />Link Button</a>
            <button class="btn btn-warn btn-disabled btn-warn-disabled" type="button">Disabled Button</button>
            <input class="btn btn-warn btn-selected btn-warn-selected" type="submit" value="selected Button" />
            <a class="btn btn-warn btn-disabled btn-warn-disabled" href="javascript:;" />Disabled Link Button</a>
        </div>
        error
        <div class="m8">
            <button class="btn btn-error" type="button">Default</button>
            <input class="btn btn-error" type="submit" value="Submit Button" />
            <a class="btn btn-error" href="javascript:;" />Link Button</a>
            <button class="btn btn-error btn-disabled btn-error-disabled" type="button">Disabled Button</button>
            <input class="btn btn-error btn-selected btn-error-selected" type="submit" value="selected Button" />
            <a class="btn btn-error btn-disabled btn-error-disabled" href="javascript:;" />Disabled Link Button</a>
        </div>


        <div class="page-header">Button Size</div>
        <div class="m8">
            <a class="btn btn-large btn-success" href="javascript:;"  />Large</a>
            <a class="btn btn-success" href="javascript:;"  />Default</a>
            <a class="btn btn-small btn-success" href="javascript:;"  />Small</a>
        </div>
        <div class="m8">
            <a class="btn btn-large btn-primary" href="javascript:;"  /><i class="icon icon-cart"></i>&nbsp;Large</a>
            <a class="btn btn-primary" href="javascript:;" /><i class="icon icon-cart"></i>&nbsp;默认大小</a>
            <a class="btn btn-small btn-primary" href="javascript:;"  /><i class="icon icon-cart"></i>&nbsp;Small</a>
        </div>
        <div class="m8">
            <a class="btn btn-large btn-warn" href="javascript:;"  />Large&nbsp;<i class="icon icon-apple"></i></a>
            <a class="btn btn-warn" href="javascript:;"  />默认大小&nbsp;<i class="icon icon-apple"></i></a>
            <a class="btn btn-small btn-warn" href="javascript:;"  />Small&nbsp;<i class="icon icon-apple"></i></a>
        </div>
        <div class="m8">
            <a class="btn btn-large btn-error" href="javascript:;"  /><i class="icon icon-cart"></i>&nbsp;Large&nbsp;<i class="icon icon-apple"></i></a>
            <a class="btn btn-error" href="javascript:;"  /><i class="icon icon-cart"></i>&nbsp;默认大小&nbsp;<i class="icon icon-apple"></i></a>
            <a class="btn btn-small btn-error" href="javascript:;"  /><i class="icon icon-cart"></i>&nbsp;Small&nbsp;<i class="icon icon-apple"></i></a>
        </div>

        <div class="page-header">Block Button</div>
        <div class="m8">
            <a class="btn btn-block" href="javascript:;"  />link Block Button</a>
            <div class="gutter-small"></div>
            <input class="btn btn-block" type="submit" value="input Block Button" />
            <div class="gutter-small"></div>
            <button class="btn btn-block" type="submit" />button Block Button</button>
        </div>
    </body>
</html>

